<!--系统设置-收支明细-->
<template>
  <div class="video-list-manage-parent" ref="parentContainer">
    <!--操作表单区域-->
    <div class="option-parent" ref="optionParentContainer">
      <el-row :gutter="0">
        <el-col :span="4">
          <el-select v-model="listTypeId" placeholder="按类型查询" style="width: 100%">
            <el-option
              v-for="item in listTypes"
              :key="item.id"
              :label="item.name"
              :value="item.id">
            </el-option>
          </el-select>
        </el-col>
        <el-col :span="4">
          <el-date-picker
            v-model="dt1"
            type="datetime"
            style="width: 100%"
            placeholder="起止日期">
          </el-date-picker>
        </el-col>
        <el-col :span="4">
          <el-date-picker
            v-model="dt2"
            type="datetime"
            style="width: 100%"
            placeholder="截止日期">
          </el-date-picker>
        </el-col>
        <el-col :span="6">
          <el-button type="primary" @click="queryArticleByBtn()">查询</el-button>
          <el-button type="primary" @click="exportDataList()">下载</el-button>
        </el-col>
      </el-row>
    </div>

    <!--数据表格区域-->
    <div v-bind:style="{height:tableHeight+'px',width:'100%'}" v-loading="loading">
      <el-table :data="detailData.agent_statement_list" border width="100%" height="100%">
        <el-table-column
          fixed
          label="时间"
          min-width="70">
          <template slot-scope="scope">
            <p>{{genTime(scope.row.dt0)}}</p>
          </template>
        </el-table-column>
        <el-table-column
          prop="areaname"
          label="类型"
          min-width="60">
          <template slot-scope="scope">
            <p>{{genInoutType(scope.row.inouttype)}}</p>
          </template>
        </el-table-column>
        <el-table-column
          prop="stmdescription"
          label="描述"
          min-width="100">
        </el-table-column>
        <el-table-column
          prop="ordersn"
          label="单据编号"
          min-width="100">
        </el-table-column>
        <el-table-column
          prop="sellertag"
          label="处理结果"
          min-width="60">
          <template slot-scope="scope">
            <p>{{genInoutresult(scope.row.inoutresult)}}</p>
          </template>
        </el-table-column>
        <el-table-column
          prop="stmamt"
          label="发生额"
          min-width="100">
        </el-table-column>
        <el-table-column
          prop="stmera"
          label="余额"
          min-width="60">
        </el-table-column>

        <!--<el-table-column label="操作">-->
        <!--<template slot-scope="scope">-->
        <!--<el-button-->
        <!--size="mini"-->
        <!--@click="handleEdit(scope.row)">编辑-->
        <!--</el-button>-->
        <!--</template>-->
        <!--</el-table-column>-->
      </el-table>
    </div>

    <!--翻页区域-->
    <div class="pagination-parent" ref="paginationParentContainer">
      <el-pagination
        class="pagination-body"
        @current-change="handleCurrentChange"
        :page-size="limit"
        layout="total, prev, pager, next"
        :total="detailData.rowcount">
      </el-pagination>
    </div>

  </div>
</template>

<script>
  import CPageBase from "../fragment/CPageBase"
  import CRootBase from "../fragment/CRootBase"

  export default {
    data() {
      return {
        pathArr: [
          {path: "/", name: "首页"},
          {path: "/container/sys_income_detail", name: "收入明细"},
        ],
        listTypes: [{id: "0", name: "全部"}, {id: "12", name: "存款和提款"}],
        listTypeId: "0",
        start: 1,
        limit: 10,
        loading: false,
        detailData: "",
        dt1: "",
        dt2: ""
      }
    },
    watch: {
      "listTypeId": function () {
        this.requestIncomeData();
      }
    },
    mixins: [CPageBase, CRootBase],
    components: {},
    mounted() {

    },
    activated() {
      this.initCurrentPath();
      this.requestIncomeData();
    },
    methods: {
      //初始化面包屑路径
      initCurrentPath() {
        this.$store.commit('changeCurrentLocation', this.pathArr);
      },

      // 导出报表
      exportDataList () {
        let url=this.$http.getDownLoadUrl(this,'agent_statement_list')
        url = url +'&dt1=' +this.getTimeDt(this.dt1)+'&dt2='+this.getTimeDt(this.dt2)+"&list_type="+this.listTypeId
        window.open(url);
      },

      //截取时间
      genTime(time) {
        return time.substring(0, time.length - 2);
      },

      //转换时间格式
      getTimeDt(dt) {
        if (this.$utils.isEmpty(dt)) {
          return '';
        }
        let nowDate = dt;
        let year1 = nowDate.getFullYear();
        let month1 = nowDate.getMonth() + 1;
        let date1 = nowDate.getDate();
        let hours1 = nowDate.getHours();
        let minutes1 = nowDate.getMinutes();
        let seconds = nowDate.getSeconds();
        if (month1 < 10) {
          month1 = "0" + month1;
        }
        if (date1 < 10) {
          date1 = "0" + date1;
        }
        if (hours1 < 10) {
          hours1 = "0" + hours1;
        }
        if (minutes1 < 10) {
          minutes1 = "0" + minutes1;
        }
        if (seconds < 10) {
          seconds = "0" + seconds;
        }
        return year1 + "-" + month1 + "-" + date1 + " " + hours1 + ":" + minutes1 + ":" + seconds;
      },

      //明细类型
      genInoutType(inouttype) {
        if (inouttype === "0") {
          return "收入";
        } else if (inouttype === "1") {
          return "提款";
        } else if (inouttype === "2") {
          return "存款";
        }
      },

      //处理结果
      genInoutresult(inoutresult) {
        if (inoutresult === "0") {
          return "pending";
        } else if (inoutresult === "1") {
          return "进行中";
        } else if (inoutresult === "2") {
          return "已受理";
        } else if (inoutresult === "3") {
          return "已失败";
        } else if (inoutresult === "4") {
          return "已完成";
        }
      },

      //打开编辑页
      handleEdit(item) {
        this.$router.push({path: 'seller_add', query: item});
      },

      //处理页面改变事件
      handleCurrentChange(currentPage) {
        this.start = this.start + this.limit;
        this.requestIncomeData();
      },

      //点击查询按钮
      queryArticleByBtn() {
        this.start = 1;
        this.limit = 10;
        this.requestIncomeData();
      },

      //获取收支明细
      requestIncomeData() {
        let parameter = new URLSearchParams();
        parameter.append("action", "agent_statement_list");
        parameter.append("list_type", this.listTypeId);
        if (this.$utils.isEmpty(this.dt1)) {
          let d1=new Date();
          d1.setHours(0);
          d1.setMinutes(0);
          d1.setSeconds(0);
          this.dt1=d1;
        }
        if (this.$utils.isEmpty(this.dt2)) {
          let d2=new Date();
          d2.setHours(23);
          d2.setMinutes(59);
          d2.setSeconds(59);
          this.dt2=d2;
        }
        parameter.append('dt1', this.getTimeDt(this.dt1));
        parameter.append('dt2', this.getTimeDt(this.dt2));
        parameter.append("pageno", this.start);
        parameter.append("pagesize", this.limit);
        parameter.append('download', 0);
        let that = this;
        that.loading = true;
        this.$http.requestAuthData(that, parameter, function (data) {
          that.detailData = data;
        });
      },


      //删除提示框
      handleDelete(item) {
        let that = this;
        this.$confirm('确认要删除该条记录吗?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          that.confireDelete(item);
        }).catch(() => {
        });
      },

      //确认删除
      confireDelete(item) {
        let that = this;
        let parameter = new URLSearchParams();
        parameter.append("action", "agent_area_modify");
        parameter.append("areaid", id);
        parameter.append("areaname", name);
        that.loading = true;
        this.$http.requestAuthData(that, parameter, function (data) {
          that.$message({type: 'success', message: '删除成功!'});
          that.requestArticleData();
        });
      },
    }
  }
</script>

<style lang="scss" scoped="" type="text/scss" src="../../assets/style/list-type-pages.scss">

</style>

